<?php echo $header; ?>
<div class="alert-wrap">
    <div class="alert-list alert-position k-l-alert-reorder">
    </div>
</div>
<div class="container in-wrap">
    <div class="row">
        <div class="col-md-10 col-md-offset-1">
            <h1 class="text-center"><?php echo $maincontent; ?></h1>
        </div>
    </div>
    <form class="form-horizontal" id="k-l-form">
        <div class="form-group from-margin-top">
            <label for="" class="control-label col-md-2 col-md-offset-1">名称</label>
            <div class="col-md-6">
                <input type="text" name="k-l-name" id="k-l-name" class="form-control" placeholder="知识点名称">
            </div>
        </div>
        <div class="form-group from-margin-top">
            <label for="" class="control-label col-md-2 col-md-offset-1">复习流程是否结束</label>
            <div class="col-md-6">
                <label class="radio-inline">
                    <input type="radio" name="k-l-complate" id="k-l-complate1" value=1> 是
                </label>
                <label class="radio-inline">
                    <input type="radio" name="k-l-complate" id="k-l-complate2" value=0> 否
                </label>
            </div>
        </div>
        <div class="form-group from-margin-top">
            <label for="" class="control-label col-md-2 col-md-offset-1">标签</label>
            <div class="col-md-6">
                <input type="text" name="k-l-label" id="k-l-label" class="form-control" placeholder="每次只能查询一个标签">
            </div>
        </div>
        <div class="form-group from-margin-top">
            <label for="" class="control-label col-md-2 col-md-offset-1">是否通过</label>
            <div class="col-md-6">
                <label class="radio-inline">
                    <input type="radio" name="k-l-pass" id="k-l-pass1" value=1> 是
                </label>
                <label class="radio-inline">
                    <input type="radio" name="k-l-pass" id="k-l-pass2" value=0> 否
                </label>
            </div>
        </div>
        <div class="form-group has-feedback from-margin-top container-start">
            <label for="" class="control-label col-md-2 col-md-offset-1">起始时间</label>
            <div class="col-md-6 date datetp start-datetime">
                <input type="text" name="k-l-start-time" id="k-l-start-time" class="form-control cursor-not-allowed" placeholder=" YYYY-MM-DD HH:MM:SS" readonly="">
                <div class="pull-right datetp-fix">
                    <span class="glyphicon glyphicon-calendar form-control-feedback little-icon"></span>
                    <span class="glyphicon glyphicon-remove form-control-feedback little-icon little-icon-remove"></span>
                </div>
            </div>
        </div>
        <div class="form-group has-feedback from-margin-top container-end">
            <label for="" class="control-label col-md-2 col-md-offset-1">截至时间</label>
            <div class="col-md-6 date datetp end-datetime">
                <input type="text" name="k-l-end-time" id="k-l-end-time" class="form-control cursor-not-allowed" placeholder="YYYY-MM-DD HH:MM:SS" readonly="">
                <div class="pull-right datetp-fix">
                    <span class="glyphicon glyphicon-calendar form-control-feedback little-icon"></span>
                    <span class="glyphicon glyphicon-remove form-control-feedback little-icon little-icon-remove"></span>
                </div>
            </div>
        </div>
        <div class="form-group from-margin-top">
            <div class="col-md-6 col-md-offset-4 col-sm-6 col-sm-offset-3">
                <a href="javascript:void(0);" class="btn btn-primary create-btn" id="k-l-search">
	     					搜索
	     				</a>
                <button type="reset" class="btn btn-primary create-btn">重置</button>
            </div>
        </div>
    </form>
    <div class="table-responsive">
        <table class="table table-bordered table-hover table-viewreminder" id="main-table">
            <tr class="warning t-header-viewreminder">
                <th id="resort-kname" data-order="ASC">知识点名称<span class="glyphicon glyphicon-minus little-icon" aria-hidden="true"></span></th>
                <th id="resort-ftime" data-order="ASC">初次完成时间<span class="glyphicon glyphicon-minus little-icon" aria-hidden="true"></span></th>
                <th id="resort-allvc">全部提醒时间及完成度</th>
                <th id="resort-rtime">已复习次数</th>
                <th id="resort-kcomplate">复习流程是否结束</th>
                <th id="resort-fstar">五星次数</th>
                <th id="resort-kpass">是否通过</th>
                <!-- glyphicon glyphicon-triangle-bottom -->
                <th id="resort-operat">操作</th>
            </tr>
            <!-- <tr>
				<td colspan="8">
					<a href="javascript:void(0);" class="btn btn-primary" id="width-test">宽度测试</a>
				</td>
			</tr> -->
            <tr>
                <td colspan="8" class="td-loading">
                    <img src="admin\view\image\loading\sixnew.gif" class="img-responsive img-center" alt="Responsive image">
                </td>
            </tr>
            <?php if ($knowledges) { ?>
            <?php foreach($knowledges as $knowledge) { ?>
            <tr class="tr-<?php echo $knowledge['kid'] ?> tr-all" data-kid="<?php echo $knowledge['kid'] ?>" data-kname="<?php echo $knowledge['kname']; ?>" data-kdetail="<?php echo $knowledge['kdetail']; ?>">
                <td>
                    <?php echo $knowledge['kname']; ?>
                </td>
                <td>
                    <?php echo $knowledge['ftime']; ?>
                </td>
                <td class="viewreminderandcomplate" title="点击出现提醒时间和完成状态详情">提醒时间和完成状态<span class="glyphicon glyphicon-triangle-bottom little-icon" aria-hidden="true"></span></td>
                <td>
                    <?php echo $knowledge['iscomplate']; ?>
                </td>
                <?php if($knowledge['iscomplate'] == 8) {?>
                <td class="iscomplate-<?php echo $knowledge['kid'] ?>">结束</td>
                <?php }else{ ?>
                <td class="iscomplate-<?php echo $knowledge['kid'] ?>">未结束</td>
                <?php } ?>
                <td>
                    <?php echo $knowledge['ispass']; ?>
                </td>
                <?php if($knowledge['ispass'] == 8) {?>
                <td class="ispass-<?php echo $knowledge['kid'] ?>">通过</td>
                <?php }else{ ?>
                <td class="ispass-<?php echo $knowledge['kid'] ?>">未通过</td>
                <?php } ?>
                <td>
                    <span class="glyphicon glyphicon-repeat little-icon icon-green k-l-repeat" aria-hidden="true" title="重新将知识点加入复习计划"></span>
                    <span class="glyphicon glyphicon-pencil little-icon icon-blue k-l-edit" aria-hidden="true" title="编辑知识点"></span>
                    <span class="glyphicon glyphicon-remove little-icon icon-red k-l-remove" aria-hidden="true" title="删除知识点"></span>
                </td>
            </tr>
            <?php } ?>
            <?php } ?>
        </table>
    </div>
    <div class="nav" aria-label="Page navigation">
        <div class="center-wrap">
            <div class="center-inner pagination-html">
                <?php echo $pagination; ?>
            </div>
        </div>
    </div>
</div>
<!-- 提醒时间和完成状态模态框 -->
<div class="modal fade" id="remind-complate-detail" tabindex="-1" role="dialog" aria-labelledby="r-c-title">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                <h4 class="modal-title" id="r-c-title"></h4>
            </div>
            <div class="modal-body">
                <img src="admin\view\image\loading\sixnew.gif" class="img-responsive img-center detailloading" alt="Responsive image">
                <div class="table-responsive">
                    <table class="table table-bordered table-hover table-viewreminder hidden" id="tabel-modal-viewreminder">
                        <tr>
                            <th>频次</th>
                            <th>时间</th>
                            <th>完成度</th>
                        </tr>
                    </table>
                </div>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                <button type="button" class="btn btn-primary">保存</button>
            </div>
        </div>
    </div>
</div>
<!-- 重新加入复习列表模态框 -->
<div class="modal fade" id="k-repeat" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header position-re">
                <div class="alert alert-warning text-center k-l-alert-repeat">
                </div>
                <h4 class="modal-title" id="myModalLabel">设置初次完成时间</h4>
            </div>
            <div class="modal-body private-modal-body">
                <div class="form-group has-feedback option-container">
                    <div class="col-md-6 col-md-offset-3 date datetp list-k-datetimepicker">
                        <input type="text" name="ftime" id="k-l-time" class="form-control" placeholder="YYYY-MM-DD HH:MM:SS" readonly>
                        <div class="pull-right datetp-fix">
                            <span class="glyphicon glyphicon-calendar form-control-feedback create-canlendar list-k-icon"></span>
                        </div>
                    </div>
                </div>
            </div>
            <div class="modal-footer">
                <p class="text-center">设置完初次完成时间，该知识点将重新被加入复习计划。必须设置该时间。</p>
                <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                <button type="button" class="btn btn-primary" id="repeat-save">保存</button>
            </div>
        </div>
    </div>
</div>
<!-- 编辑模态框 -->
<div class="modal fade" id="k-edit" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <div class="alert alert-warning text-center k-l-alert-edit">
                </div>
                <h4 class="modal-title" id="e-l-title">编辑知识点</h4>
            </div>
            <div class="modal-body">
                <img src="admin\view\image\loading\sixnew.gif" class="img-responsive img-center detailloading" alt="Responsive image">
                <form class="form-horizontal" method="post" action="" id="l-form">
                    <div class="form-group from-margin-top">
                        <label for="" class="control-label col-md-3 col-md-offset-1">知识点名称</label>
                        <div class="col-md-6">
                            <input type="text" name="l-knowledgename" id="l-knowledgename" class="form-control" placeholder="最好是能说明内容的名称">
                        </div>
                    </div>
                    <div class="form-group from-margin-top">
                        <label for="" class="control-label col-md-3 col-md-offset-1">知识点标签</label>
                        <div class="col-md-6">
                            <input type="text" name="l-knowledgelabel" id="l-knowledgelabel" class="form-control" placeholder="查询时有用，用英文逗号分隔">
                        </div>
                    </div>
                    <div class="form-group from-margin-top">
                        <label for="" class="control-label col-md-3 col-md-offset-1">知识点详情</label>
                        <div class="col-md-6">
                            <textarea name="l-knowledgedetail" id="l-knowledgedetail"></textarea>
                        </div>
                    </div>
                </form>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                <a href="javascript:void(0);" class="btn btn-primary" id="submit-list-k">保存</a>
            </div>
        </div>
    </div>
</div>
<!-- 删除确认模态框 -->
<div class="modal fade" id="k-remove" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <div class="alert alert-warning text-center k-l-alert-remove">
                </div>
                <h4 class="modal-title" id="remove-title">删除知识点</h4>
            </div>
            <div class="modal-body">
                <h4 class="text-center">确认删除该知识点吗？</h4>
                <p class="text-center">知识点被删除后将永久从系统中删除</p>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
                <a href="javascript:void(0)" class="btn btn-primary" id="reomve-k-submit">删除</a>
            </div>
        </div>
    </div>
</div>
<?php echo $footerin;?>
<script>
$(function() {
    //各个target
    var $repeattarget = $(".k-l-alert-repeat");
    var $reomvetarget = $(".k-l-alert-remove");
    var $edittarget = $(".k-l-alert-edit");
    var $oandstarget = $(".k-l-alert-reorder"); //排序警告，搜索警告
    //时间选择插件
    $(".list-k-datetimepicker").datetimepicker({
        format: 'yyyy-mm-dd hh:ii:ss',
        container: $(".option-container")
    });
    $(".start-datetime").datetimepicker({
        format: 'yyyy-mm-dd hh:ii:ss',
        container: $(".container-start")
    });
    $(".end-datetime").datetimepicker({
        format: 'yyyy-mm-dd hh:ii:ss',
        container: $(".container-end")
    });
    //搜索加载
    //名称验证
    $("#k-l-name").on("blur", function() {
        var e;
        var kname = $(this).val();
        if (e = kname_vel(kname, 1)) {
            alert2000($oandstarget, e);
            return false;
        };
    });
    //标签验证
    $("#k-l-label").on("blur", function() {
        var e;
        var klabel = $(this).val();
        if (e = klabel_vel(klabel, 1)) {
            alert2000($oandstarget, e);
            return false;
        }
    });
    //点击搜索
    $("#k-l-search").click(function() {
        var args;
        if (args = getArgs($oandstarget)) {
            getData($oandstarget, args);
        }
    });

    //重新排序
    //按照时间排序
    (function() {
        var args;
        var $ftimetarget = $("#resort-ftime");
        orderByField($ftimetarget, "ftime", $oandstarget);
        //按照名称排序
        var $knametarget = $("#resort-kname");
        orderByField($knametarget, "kname", $oandstarget);
    }());

    //查看知识点完成详情
    //点击查看
    $(document).on("click", ".viewreminderandcomplate", function() {
            var kname = $(this).closest("tr").data("kname");
            var kid = $(this).closest("tr").data("kid");
            $("#remind-complate-detail").modal();

            //显示后的动作，数据加载
            $("#remind-complate-detail").on("shown.bs.modal", function(e) {
                    $("#r-c-title").html(kname);
                    $.ajax({
                            type: "POST",
                            dataType: "json",
                            url: "<?php echo $getdetailurl; ?>",
                            data: {
                                kid: kid
                            },
                            beforeSend: function() {
                                $(".detailloading").css("display", "block");
                            },
                            success: function(data) {
                                $("#remind-complate-detail").off("shown.bs.modal");
                                $(".detailloading").css("display", "none");
                                var html_view;
                                $.each(data, function(i, v) {
                                    var allstar = "";
                                    if (v.star == 0) {
                                        allstar = "<span class='glyphicon glyphicon-star-empty star' aria-hidden='true'></span>";
                                    } else {
                                        for (var i = 1; i <= v.star; i++) {
                                            allstar += "<span class='glyphicon glyphicon-star star' aria-hidden='true'></span>";
                                        }
                                    }
                                    html_view += "<tr><td>" + v.times + "</td><td>" + v.date + "</td><td>" + allstar + "</td>";
                                })
                                $("#tabel-modal-viewreminder").removeClass("hidden");
                                $("#tabel-modal-viewreminder tr:eq(0)").after(html_view);
                            }
                        }) //ajax
                })
                //隐藏时的动作
            $("#remind-complate-detail").on("hidden.bs.modal", function(e) {
                $("#tabel-modal-viewreminder").addClass("hidden");
                $("#tabel-modal-viewreminder tr:gt(0)").remove();
                $("#r-c-title").html("标题正在加载……");
            })
        })
        //重新加入复习流程
        //点击出现模态框
    $(document).on("click", ".k-l-repeat", function() {
            $("#k-l-time").val("");
            var kid = $(this).closest("tr").data("kid");
            $("#k-repeat").modal();
            $("#repeat-save").data("kid", kid);
        })
        //关闭操作
    $("#k-repeat").on("hidden.bs.modal", function(e) {
            $.cleanData(this);
        })
        //点击保存
    $("#repeat-save").on("click", function() {
            var kid = $(this).data("kid");
            var ftime = $("#k-l-time").val();
            if (e = ktime_vel(ftime)) {
                alert2000($repeattarget, e, 2);
                return false;
            }
            $.ajax({
                    type: "POST",
                    dataType: "json",
                    url: "<?php echo $repeatkurl; ?>",
                    data: {
                        kid: kid,
                        ftime: ftime
                    },
                    beforeSend: function() {
                        $repeattarget.html("正在发送请求，请稍后！").fadeIn();
                        setTimeout(function() {
                            $repeattarget.fadeOut("slow", function() {
                                $repeattarget.html("");
                            });
                        }, 2000);
                    },
                    success: function(data) {
                        //关闭模态框
                        $(".tr-" + kid + " td:eq(1)").html(ftime + ":00");
                        $(".iscomplate-" + kid).html("未结束");
                        $("#k-repeat").modal('hide');
                        alert2000($repeattarget, data, 2);
                    }
                }) //ajax
        })
        //删除知识点
    $(document).on("click", ".k-l-remove", function() {
        var kid = $(this).closest("tr").data("kid");
        var kname = $(this).closest("tr").data("kname");
        $("#remove-title").html(kname);
        $("#reomve-k-submit").data("kid", kid);
        $("#reomve-k-submit").data("kname", kname);
        $("#k-remove").modal();
    })
    $("#width-test").click(function() {
        var left = $(".header-container").offset().left;
        alert("header-containerheader-container:" + left);
    })
    $("#reomve-k-submit").on("click", function() {
            var kid = $(this).data("kid");
            var kname = $(this).data("kname");
            $.ajax({
                    type: "POST",
                    dataType: "json",
                    url: "<?php echo $removekurl; ?>",
                    data: {
                        kid: kid
                    },
                    beforeSend: function() {
                        $reomvetarget.html("正在发送请求，请稍后！").fadeIn();
                        setTimeout(function() {
                            $reomvetarget.fadeOut("slow", function() {
                                $reomvetarget.html("");
                            });
                        }, 2000);
                    },
                    success: function(data) {
                        if (data) {
                            $reomvetarget.html("数据删除成功！").fadeIn();
                        } else {
                            $reomvetarget.html(data).fadeIn();
                        }

                        setTimeout(function() {
                            $reomvetarget.fadeOut("slow", function() {
                                $reomvetarget.html("");
                            });
                        }, 2000);
                        $(".tr-" + kid).remove();
                        setTimeout(function() {
                            $("#k-remove").modal("hide");
                        }, 1000)

                    }
                }) //ajax
        })
        //编辑知识点
        //按钮触发操作
    $(document).on("click", ".k-l-edit", function() {
            var kid = $(this).closest("tr").data("kid");
            var kname = $(this).closest("tr").data("kname");
            var kdetail = $(this).closest("tr").data("kdetail");
            $("#k-edit").data("kid", kid);
            $("#submit-list-k").data("kid", kid);
            $("#submit-list-k").data("kname", kname);
            $("#submit-list-k").data("kdetail", kdetail);
            $("#k-edit").modal();
        })
        //显示后操作，数据加载
    $("#k-edit").on("shown.bs.modal", function(e) {
            var kid = $(this).data("kid");
            $.ajax({
                type: "POST",
                dataType: "json",
                data: {
                    kid: kid
                },
                url: "<?php echo $getlabelurl; ?>",
                beforeSend: function() {
                    $(".detailloading").css("display", "block");
                    $("#e-l-title").html("数据正在加载……");
                },
                success: function(data) {
                    var kname = $("#submit-list-k").data("kname");
                    var kdetail = $("#submit-list-k").data("kdetail");
                    var labels = "";
                    $.each(data, function(i, v) {
                        labels += v.label + ",";
                    });
                    labels = labels.substring(0, labels.length - 1);
                    $("#submit-list-k").data("label", labels);
                    $("#e-l-title").html("编辑知识点");
                    $("#l-knowledgename").val(kname);
                    $("#l-knowledgedetail").val(kdetail);
                    $("#l-knowledgelabel").val(labels);
                    $(".detailloading").css("display", "none");
                    $("#l-form").css("display", "block");

                },
                error: function(XMLHttpRequest, textStatus, errorThrown) {
                    alert(XMLHttpRequest.status);
                    alert(XMLHttpRequest.readyState);
                    alert(textStatus);
                }
            })
        })
        //编辑表单验证
        //名称验证
    $("#l-knowledgename").on("blur", function() {
        var kname = $(this).val();
        if (e = kname_vel(kname)) {
            alert2000($edittarget, e, 2);
            return false;
        };
    });
    //标签验证
    $("#l-knowledgelabel").on("blur", function() {
        var klabel = $(this).val();
        if (e = klabel_vel(klabel)) {
            alert2000($edittarget, e, 2);
            return false;
        }
    });
    //详情验证
    $("#l-knowledgedetail").on("blur", function() {
        var kdetail = $(this).val();
        if (e = kdetail_vel(kdetail)) {
            alert2000($edittarget, e, 2);
            return false;
        }
    });
    //点击保存操作
    $("#submit-list-k").on("click", function() {
            var kid = $(this).data("kid");
            var kname = $(this).data("kname");
            var kdetail = $(this).data("kdetail");
            var label = $(this).data("label");
            var v_kname = $("#l-knowledgename").val();
            var v_label = $("#l-knowledgelabel").val();
            var v_kdetail = $("#l-knowledgedetail").val();
            if (kname === v_kname && v_kdetail === kdetail && v_label === label) {
                $edittarget.html("数据未变更！").fadeIn();
                setTimeout(function() {
                    $edittarget.fadeOut("slow", function() {
                        $edittarget.html("");
                    });
                }, 800);

                return false;
            }
            //再次验证
            var idinfo;
            try {
                if (idinfo = kname_vel(v_kname)) {
                    throw idinfo;
                };
                if (idinfo = klabel_vel(v_label)) {
                    throw idinfo;
                };
                if (idinfo = kdetail_vel(v_kdetail)) {
                    throw idinfo;
                };

            } catch (e) {
                alert2000($edittarget, e, 2);
                return false;
            }
            $.ajax({
                type: "POST",
                dataType: "json",
                data: {
                    kid: kid,
                    kname: v_kname,
                    kdetail: v_kdetail,
                    label: v_label
                },
                url: "<?php echo $eidturl; ?>",
                beforeSend: function() {
                    $("#l-form").css("display", "none");
                    $(".detailloading").css("display", "block");
                    $("#e-l-title").html("数据正在加载……");
                },
                success: function(data) {
                    //修改tr的绑定，kname,kdetail,要获取kid
                    $(".tr-" + kid).data("kname", v_kname);
                    $(".tr-" + kid).data("kdetail", v_kdetail);
                    $(".tr-" + kid + " td:first").html(v_kname);
                    $("#submit-list-k").data("label", v_label);
                    $("#e-l-title").html("编辑知识点");
                    $(".detailloading").css("display", "none");
                    $("#l-form").css("display", "block");
                    alert2000($edittarget, "修改成功！", 2);
                    setTimeout(function() {
                        $("#k-edit").modal("hide");
                    }, 800)
                }
            })
        })
        //关闭后操作
    $("#k-edit").on("hide.bs.modal", function(e) {
        $("#l-form").css("display", "none");
        $(".detailloading").css("display", "block");

    })
})
</script>
<?php echo $footer;?>
